import React from 'react'
import { CSSTransition } from 'react-transition-group'
import { type TransitionProps } from './types'

const Transition: React.FC<TransitionProps> = (props) => {
	const { children, classNames, animation, wrapper, ...restProps } = props
	return (
		<CSSTransition
			classNames={classNames ? classNames : animation}
			{...restProps}
		>
			{wrapper ? <div>{children}</div> : children}
		</CSSTransition>
	)
}

Transition.defaultProps = {
	unmountOnExit: true,
	appear: true
}

export default Transition
